<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>En ca' Paqui</title>
        <link href="styles/styles.css" rel="stylesheet" type="text/css">
        <script src="scripts/jquery-1.7.js" type="text/javascript"></script>
        <script src="scripts/general.js" type="text/javascript"></script>  
        <script>
            $(document).ready(function() {
                    $("#texto").bind('keypress', function(event){
                    var opcion = $('#tipo option:selected').html();
                    if (opcion == "Precio") {
                        if ( (  (event.keyCode < 48) || (event.keyCode > 57)) && (event.keyCode != 13) && (event.keyCode != 46))
                            return false;
                    }
                });
            });
            function mostrarOperador(){
                var opcion = $('#tipo option:selected').html();
                    if (opcion == "Precio") 
                        $('#operador').css('display','initial');
                    else
                        $('#operador').css('display','none');
            }
        </script>
    </head>
    <body>
            <h1 id="titulo">Tienda virtual "En ca' Paqui"</h1>
            <div class="cesta">
                <span>Cesta: </span><span><b>0</b></span><span> artículo/s | </span> <a href='Login'> Loguearse </a>
            </div>
            <div class="superior">
                <div class="categoria">
                    <b>Categoría</b>       
                        <p><a id ="sangria" href="index?t=1&categoria=1">Alimentación</a> </p>
                        <p><a id ="sangria" href="index?t=1&categoria=2">Droguería</a> </p>              
                        <p><a id ="sangria" href="index?t=1&categoria=3">Prensa</a> </p>               
                        <p><a id ="sangria" href="index?t=1&categoria=4">Herramientas</a>  </p>    
                </div>
                
                <div class="busqueda">  
                    <form name="Busqueda" action="index" method="get" class="formBusqueda">
                        <b>Busqueda</b> 
                        <select id="tipo" name="t" size="1" onchange="$('#texto').attr('value','');mostrarOperador();">
                            <option name='t' value='2'>Nombre</option>
                            <option name='t' value='3'>Precio</option>
                        </select>
                        <select class ='operador' id="operador" name="operador" size="1">
                            <option value="1">menor que</option>
                            <option value="2">menor igual que</option>
                            <option value="3">igual que</option>
                            <option value="4">mayor o igual que</option>
                            <option value="5">mayor que</option>                            
                        </select>
                        <input id="texto" type="text" name="texto" value="" />
                        <input type="submit" value="Ir" name="Ir" />
                    </form>
                </div>
            </div>
            <div class="contenido">
                <h2>Por favor, seleccione una categoría o busque un artículo para comenzar.</h2>
            </div>
    </body>
</html>
